/** @jsxImportSource @emotion/react */
import * as React from "react";
import {OriginalViewProps} from "../../common/base";
import {config设备概况, EntranceSetup, Projects默认} from "./orcBase";
import {createItem,} from "../../common/eHelper";
import {useRecordListSubr} from "../../hook/useRecordListSub";
import {DeviceSurvey} from "../../elevator/editor";
import {AppendixPage} from "./AppendixPage";
import {MaterialReview, PreviousQuestion} from "./MaterialReview";
import {AccessoriesLiquid, AccessoriesValve} from "./Accessories";
import {ProjectListMvs} from "../../movable/Projects";
import {BlobInputList, Text} from "customize-easy-ui-component";
import {DrawingsExplan} from "../../boiler/power/DrawingsExplan";
import {tableSetInp} from "../../../common/tool";
import {ConclusionSphe} from "./Conclusion";
import {Macroscopic} from "./Macroscopic";

export const tail安附件= <Text css={{"@media print": {fontSize: '0.75rem'}}}>
    注：可附具体的检测报告。
</Text>;
export const tail宏观检= <Text css={{"@media print": {fontSize: '0.75rem'}}}>
  注：检验结果栏中，打“√”的表示无问题或合格的检验项目，打“×”的表示有问题或不合格的检验项目，填写“无此项”的表示实际没有的检验项目，划“－”的表示无法检验的项目。
</Text>;

const dlistDrawing=['球罐排版图（附页或附图）','（附页或附图）'];
const editAs=(inp:any, setInp:React.Dispatch<React.SetStateAction<any>>, dxtix:number,refWidth?:number)=>{
  return <div css={{width: '100%'}}>
    首先选择输入该份的标题名：
    <BlobInputList value={inp?.联络单?.[dxtix]?.til || ''} datalist={dlistDrawing}
                   css={{display: 'inline-flex',
                     minWidth: refWidth!>450? 'unset':'100%',  width:  refWidth!>450? '25rem':'unset',
                   }} rows={2}
                   onListChange={v => tableSetInp('附页图', dxtix, inp, setInp, 'til', v || undefined)}/>
  </div>;
};

//有独立模板的分项报告（动态加载/非静态编译的）的编辑器是独立配置的，在操作页面上也是单独的。没有和主报告掺和在一起。useSubRepMain("cm/gasproof", {nestMd:'GASPR_TS',;
const recordPrintList =[
  createItem('Entrance', <EntranceSetup/>),
  createItem('ProjectList', <ProjectListMvs  projects={Projects默认}/>),
  createItem('Survey', <DeviceSurvey config={config设备概况} label={'检验结论报告-设备概况'}/>),

  createItem('Conclusion', <ConclusionSphe label={'检验结论报告-下结论'}/>),
  createItem('AppendixPage', <AppendixPage label={'球形储罐定期检验报告附页'}/>),

  createItem('MaterialReview', <MaterialReview label={'球形储罐资料审查报告-概况'}/>),
  createItem('PreviousQuestion', <PreviousQuestion label={'球形储罐资料审查报告-结果和上次问题'}/>),

  createItem('Macroscopic', <Macroscopic label={'球形储罐宏观检验报告'} children={tail宏观检}/>),

  createItem('Accessories', <AccessoriesValve label={'安全附件及仪表检验报告(上)'}/>),
  createItem('AccessoriesLiquid', <AccessoriesLiquid label={'安全附件及仪表检验报告(下)'}  children={tail安附件}/>),
      //通用的附页模式： 打印会独占一张纸子的，一般是一张图的。table可以有多张。
  createItem('DrawingsExplan', <DrawingsExplan table={'附页图'} editAs={editAs} label='球罐排版附页图'/>),
  //嵌入redId nestMd 动态解析URL寻找定位的分项报告原始的不分是独立或者嵌套公用入口编辑器？这里当前做法是直接拷贝import组件的！组件的文件目录都是不相等的！！
  //壁厚测定报告 的 分项控制器：后面不需要要配<Corrosive/>的。 对应/report/THICKM_VS/ver/1/akDHJi77Qh2xTd4BJwdb5FJlcG9ydA/THICKM_VS/_Controller
  createItem('_Controller',  <></>),
];


export const OriginalView=
  React.forwardRef((
    { action: modAction,  verId, repId='', rep}
    :OriginalViewProps, ref
  ) => {
    const {list}=useRecordListSubr(ref,rep,recordPrintList,modAction,verId);
    return <React.Fragment>
      {list}
    </React.Fragment>;
  } );
